<!--
 * @Author: chenxuan
 * @Date: 2021-10-08 23:28:12
 * @LastEditTime: 2021-10-08 23:54:58
 * @LastEditors: chenxuan
-->

<template>
    <div class="home-container">
        <div class="top"></div>
        <sinan />
        <seamless />
        <pyramid />
        <scrollArc />
        <szBar />
        <ringPin />
        <rotateColorful />
        <circleRunway />
        <scanRadius />
        <cakeLinkage />
        <pyramidTrend />
        <dynamicLine />
        <staffMix />
        <flashCloud />
        <ringPie />
        <colorfulRadar />
        <dynamicList />
        <bar3d/>
        <colorfulArea />
        <rainbow />
        <waterPolo/>
        <gauge />
        <circleNesting />
    </div>
  </template>
  <script>
  import { screenSize } from './assets/js/utils'
  export default {
    name: 'Home',
    components: {},
    data() {
        return {
            
        }
    },
    computed: {
        
    },
    created() {
    },
    mounted() {
      // screenSize(this.$refs.editor);
    },
    methods: {
      
    }
  }
  </script>
  
  <style lang="scss" scoped>
  .home-container {
    width: 100%;
    height: 100vh;
    background-color: #000;
    overflow-y: auto;
    position: relative;
    .top {
        position: absolute;
        left: 0; 
        top: 0; 
        width: 100%; 
        height: 80px; 
        background-color: transparent; 
        background: url(./assets/img/top_nav.png) no-repeat; 
        background-position: 65% 0;
        border: none; 
        overflow: hidden;
      }
  }	
  </style>
  <style>
/* @import '@/assets/style/common.scss'; */
  </style>
  